import React, { Component } from 'react'
import { StyleSheet, View, BackHandler } from 'react-native'
import CommonColor from '../../styles/RXColor'
// import TitleBar from './TitleBar'
// import PlatformUtil from '../utils/PlatformUtil'

export default class RXPage extends Component {
  constructor(props) {
    super(props)
    this.viewDidAppear = this.viewDidAppear.bind(this)
    this.viewDidDisappear = this.viewDidDisappear.bind(this)
  }

  UNSAFE_componentWillMount() {
    if (this.navigation) {
      this.appear = this.props.navigation.addListener(
        'didFocus',
        this.viewDidAppear
      )
      this.disappear = this.props.navigation.addListener(
        'didBlur',
        this.viewDidDisappear
      )
    }
    // if (PlatformUtil.isAndroid()) {
    //   BackHandler.addEventListener('hardwareBackPress', this.onBackAndroid)
    // }
  }

  componentWillUnmount() {
    if (this.appear) {
      this.appear.remove()
      this.appear = null
    }
    if (this.disappear) {
      this.disappear.remove()
      this.disappear = null
    } 
    // if (PlatformUtil.isAndroid()) {
    //   BackHandler.removeEventListener('hardwareBackPress', this.onBackAndroid)
    // }
  }

  onBackAndroid = () => {
    this.navigation.goBack()
    return true
  }

  get navigation() {
    return this.props.navigation
  }

  get navParams() {
    return this.props.route.params || {}
  }

  viewDidAppear() {}

  viewDidDisappear() {}

  renderNavigationBar() {
    // if (this.isHiddenNavigation()) {
    //   return null
    // } else {
    //   return (
    //     <TitleBar
    //       ref={(e) => {
    //         this.titleBar = e
    //       }}
    //       title={this.renderNavigationTitle()}
    //       isHiddenRenderLeft={this.isHiddenNavigationLeft()}
    //       onLeftPress={this.onLeftPress}
    //       isHiddenRenderRight={this.isHiddenNavigationRight()}
    //       renderRight='首页'
    //       onRightPress={this.onRightPress}
    //     ></TitleBar>
    //   )
    // }
    return null
  }

  onLeftPress = () => {
    this.navigation.goBack()
  }

  onRightPress = () => {}

  isHiddenNavigationLeft() {
    return false
  }

  isHiddenNavigationRight() {
    return true
  }

  renderNavigationTitle() {
    return null
  }

  getGotoPagePointName() {
    return null
  }

  isHiddenNavigation() {
    return false
  }

  renderPage() {
    return null
  }

  render() {
    return (
      <View
        style={[
          styles.container,
          {
            backgroundColor: CommonColor.BgPage,
          },
        ]}
      >
        {this.renderNavigationBar()}
        <View style={[styles.pageContainer, {}]}>{this.renderPage()}</View>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  pageContainer: {
    flex: 1,
  },
})
